import type {CrudSchema} from '@/hooks/web/useCrudSchemas'
import {dateFormatter} from '@/utils/formatTime'

// 表单校验
export const rules = reactive({
  typeId: [required],
  code: [required],
  name: [required],
  description: [required],
  openedAt: [required],
  closedAt: [required],
  price: [required],
  status: [required],
})

// CrudSchema https://doc.iocoder.cn/vue3/crud-schema/
const crudSchemas = reactive<CrudSchema[]>([
  {
    label: '序号',
    field: 'index',
    type: 'index',
    isForm: false,
  },
  {
    label: '体育场馆类型',
    field: 'typeId',
    isSearch: true,
    search: {
      component: 'Select',
      componentProps: {
        style: 'width: 192px',
      }
    },
    form: {
      component: 'Select',
      componentProps: {
        style: 'width: 192px',
      }
    }
  },
  {
    label: '体育场馆编码',
    field: 'code',
    isSearch: true,
  },
  {
    label: '体育场馆名称',
    field: 'name',
    isSearch: true,
  },
  {
    label: '体育场馆描述',
    field: 'description',
    isSearch: true,
    form: {
      component: 'Editor',
      componentProps: {
        valueHtml: '',
        height: 200
      }
    },
  },
  {
    label: '开放时间',
    field: 'openedAt',
    isSearch: true,
    form: {
      component: 'TimePicker',
      componentProps: {
        valueFormat: 'HH:mm',
        isRange: false,
      }
    },
    search: {
      component: 'TimePicker',
      componentProps: {
        valueFormat: 'HH:mm',
        isRange: true,
      }
    },
  },
  {
    label: '关闭时间',
    field: 'closedAt',
    isSearch: true,
    form: {
      component: 'TimePicker',
      componentProps: {
        valueFormat: 'HH:mm',
        isRange: false,
      }
    },
    search: {
      component: 'TimePicker',
      componentProps: {
        valueFormat: 'HH:mm',
        isRange: true,
      }
    },
  },
  {
    label: '单价（元 / 小时)',
    field: 'price',
    isSearch: true,
  },
  {
    label: '当前场馆状态',
    field: 'status',
    isSearch: true,
    dictType: DICT_TYPE.VENUE_STATUS,
    dictClass: 'number',
    search: {
      component: 'Select',
      componentProps: {
        style: 'min-width: 192px',
      }
    }
  },
  {
    label: '创建时间',
    field: 'createTime',
    formatter: dateFormatter,
    isSearch: true,
    search: {
      component: 'DatePicker',
      componentProps: {
        valueFormat: 'YYYY-MM-DD HH:mm:ss',
        type: 'daterange',
        defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
      }
    },
    isForm: false,
  },
  {
    label: '操作',
    field: 'action',
    isForm: false
  }
])
export const {allSchemas} = useCrudSchemas(crudSchemas)
